// created by jimmy 2016/2/19
var count = 0; //当前滑动页数 下标0 开始
var totalCount = 0; //总滑动页数
var dis = 0; //动画滑动的距离
var clickNum = 0; //点击的数据在总数据中的位置
var num = 0; //在当前页中位置
var cateId = ""; //类别id
var regionId = ""; //区域id
var catelist;
$(document).ready(function() {

    /*计算总页数*/
    totalCount = parseInt($("#innerSecond").width() / 1184);
    catelist = $.parseJSON($("#innerSecond").attr("data-list")); //$.parseJSON jquery 语法
    // catelist = JSON.parse($("#innerSecond").attr("data-list"));
    // catelist = $("#innerSecond").attr("data-list");
    /*左滑按钮功能*/
    $("#leftBtn").click(function() {
        if (count > 0) {
            count--;
            if (count == 0) {
                dis = 0;
            } else {
                dis = 1184 + dis;
            }
            $("#innerSecond").animate({ left: dis + "px" }, "slow");
        }
    });

    /*右滑按钮功能*/
    $("#rightBtn").click(function() {
        if (count < totalCount) {
            count++;
            dis = -count * 1184;
            $("#innerSecond").animate({ left: dis + "px" }, "slow");
        }
    });

    $(".cate-item").hover(function() {
        /*获取当前点击的分类按钮在所有按钮中的位置 下标 1 开始*/
        var num = $(this).attr("data-num");
        /*遍历所有类别按钮*/
        $(".cate-item").each(function() {
            /*找到hover按钮*/
            if ($(this).attr("data-num") == num) {
                $(this).find("img").prop("src", getActiveImageUrl(num));
            }
        });
    });
    $(".cate-item").mouseleave(function() {
        /*获取当前点击的分类按钮在所有按钮中的位置 下标 1 开始*/
        var num = $(this).attr("data-num");
        /*遍历所有类别按钮*/
        $(".cate-item").each(function() {
            /*找到hover按钮*/
            if ($(this).attr("data-num") == num) {
                if ($(this).attr("data-flag") == "true") return;
                $(this).find("img").prop("src", getImageUrl(num));
            }
        });
    });

    var lockItem = true;
    /*为每个分类按钮绑定点击事件*/
    $(".cate-item").click(function() {
        if (lockItem) {
            lockItem = false;

            if ($("#leftBtn") != 'undefined' && $("#rightBtn") != 'undefined') {
                /*隐藏左右滑按钮*/
                // $("#leftBtn")[0].style.display = "none";
                // $("#rightBtn")[0].style.display = "none";
                $("#leftBtn").css("display", "none");
                $("#rightBtn").css("display", "none");
            }
            /*获取当前点击的分类的id*/
            cateId = $(this).attr("data-cateId");
            /*获取当前点击的分类按钮在所有按钮中的位置 下标 1 开始*/
            clickNum = $(this).attr("data-num");
            /*获取当前点击的分类按钮在当前页的按钮中的位置 下标 1 开始*/
            num = clickNum - count * 8;
            /*遍历所有类别按钮*/
            $(".cate-item").each(function(i) {
                /*找到非点击按钮*/
                if ($(this).attr("data-num") != clickNum) {
                    if (isIELow()) {
                        $(this).css("visibility", "hidden");
                    } else {
                        /*添加active,设置透明度 opacity 从1到0*/
                        $(this).addClass("active");
                    }
                    $(this).attr("data-flag", "false");
                    $(this).find("img").prop("src", getImageUrl(i + 1));
                } else {
                    $(this).attr("data-flag", "true");
                    $(this).find("img").prop("src", getActiveImageUrl(clickNum));
                }
            });
            /*计算左滑动画滑动的距离*/
            dis = dis - (num - 1) * 148;
            /*左滑动dis距离*/
            $("#innerSecond").animate({ left: dis + "px" }, "slow", function() {

                $(".cate-item").each(function() {
                    /*找到非点击按钮*/
                    if ($(this).attr("data-num") == clickNum)
                        $(this).find("img").prop("src", getActiveImageUrl(clickNum));
                });

                //动画结束后回调, 注:设置opacity 和 设置隐藏显示冲突，用setTimeout方式实现
                /*去除 hide,把index-nav-inner-area 这块显示出来*/
                $(".index-nav-inner-area").removeClass("hide");

                /*添加 active 设置透明度 opacity 从0到1*/
                setTimeout(function() {
                    lockItem = true;
                    $(".index-nav-inner-area").addClass("active");

                    var h = (214 - $(".inner-area").height()) / 2;
                    $(".inner-area").css("top", h);

                    /*获取当前城市id*/
                    cityId = $("#cityText").attr("data-cityId");
                    /*回调场馆列表*/
                    requestBusinessList(true);

                }, 200);
            });
        }
    });

    var lock = true;
    /*选区返回按钮*/
    $(".area-right-btn").click(function() {

        if (lock) {
            lock = false;
            /*去除 active : 设置透明度 opacity 从1到0*/
            $(".index-nav-inner-area").removeClass("active");
            /*增加 hide : 隐藏 index-nav-inner-area 这块*/
            setTimeout(function() {

                $(".index-nav-inner-area").addClass("hide");
                if ($("#leftBtn") != 'undefined' && $("#rightBtn") != 'undefined') {
                    /*显示左右滑按钮*/
                    // $("#leftBtn")[0].style.display = "inline-block";
                    // $("#rightBtn")[0].style.display = "inline-block";
                    $("#leftBtn").css("display", "inline-block");
                    $("#rightBtn").css("display", "inline-block");
                }
                /*遍历所有类别按钮*/
                $(".cate-item").each(function() {
                    /*找到非点击的按钮*/
                    if ($(this).attr("data-num") != clickNum) {

                        if (isIELow()) {
                            $(this).css("visibility", "visible");
                        } else {
                            /*去除 active : 把隐藏的分类按钮显示出来 opacity 从0到1*/
                            $(this).removeClass("active");
                        }
                    } else {
                        $(this).attr("data-flag", "false");
                        $(this).find("img").prop("src", getImageUrl(clickNum))
                    }
                });

                $(".inner-context").each(function(i) {
                    /*去除active,把蓝色字体改为黑色*/
                    if (i == 0) {
                        $(this).addClass("active");
                    } else {
                        $(this).removeClass("active");
                    }
                });

                /* 计算右滑动画滑动的距离*/
                dis = dis + (num - 1) * 148;
                /*右滑动dis距离*/
                $("#innerSecond").animate({ left: dis + "px" }, "slow", function() {
                    lock = true;
                    cateId = "";
                    regionId = "";
                    /*回调场馆列表*/
                    requestBusinessList(true);
                });
            }, 200);
        }
    });

    /*为每个区域数据绑定点击事件*/
    $(".inner-context").click(regionClick);

});

function regionClick() {
    /*获取点击区域的id*/
    regionId = $(this).attr("data-regionId");
    /*获取当前城市id*/
    cityId = $("#cityText").attr("data-cityId");
    /*遍历所有区域按钮*/
    $(".inner-context").each(function() {
        /*去除active,把蓝色字体改为黑色*/
        $(this).removeClass("active");
        /*找到当前点击的区域按钮*/
        if ($(this).attr("data-regionId") == regionId) {
            /*添加active,把当前按钮中的字体颜色改为蓝色*/
            $(this).addClass("active");
            // /*组合接口参数*
            /*回调场馆列表*/
            requestBusinessList(true);
        }
    });
};

function getActiveImageUrl(num) {
    var url = "";
    $.each(catelist, function(i, cateItem) {
        if (num - 1 == i) {
            url = cateItem.active_image_url;
        }
    })
    return url;
}

function getImageUrl(num) {
    var url = "";
    $.each(catelist, function(i, cateItem) {
        if (num - 1 == i) {
            url = cateItem.image_url;
        }
    })
    return url;
}
